<template>
  <view class="index">
    <nut-navbar title="AI 小站" @click-title="onClick"></nut-navbar>
    <nut-swiper :auto-play="3000">
    <nut-swiper-item v-for="(item, index) in swiperList" :key="index" style="height: 150px">
      <img :src="item" alt="" style="height: 100%; width: 100%" draggable="false" />
    </nut-swiper-item>
  </nut-swiper>
    <nut-toast v-model:visible="show" msg="你成功了" />
    <nut-grid :column-num="3" square>
      <nut-grid-item text="AI画质">
        <Dongdong />
      </nut-grid-item>
      <nut-grid-item text="AI聊天">
        <Dongdong />
      </nut-grid-item>
      <nut-grid-item text="AI生图">
        <Dongdong />
      </nut-grid-item>
    </nut-grid>
    <nut-searchbar v-model="val" background="linear-gradient(to right, #9866F0, #EB4D50)" input-background="#fff">
      <template #rightin>
        <Photograph />
      </template>
      <template #rightout>
        <nut-button type="primary" @click="onClick">AI搜索</nut-button>
      </template>
    </nut-searchbar>
    <div style="position: relative; height: 150px">
      <nut-barrage ref="barrageRef" :danmu="list"></nut-barrage>
    </div>
  </view>
</template>

<script setup>
import { h, ref } from 'vue'
import Taro from '@tarojs/taro'
import { getStorageSync,createSelectorQuery  } from '@tarojs/taro'
import { Home, Category, Find, Cart, My,  } from '@nutui/icons-vue-taro'
const show = ref(false)
const onClick = () => {
  show.value = true
  Taro.navigateTo({ url: '/pages/super-reso/super-reso' })
}

const barrageRef = ref()
const list = ref(['画美不看', '不明觉厉', '喜大普奔', '男默女泪', '累觉不爱', '爷青结-'])
const swiperList = ref([
  'https://storage.360buyimg.com/jdc-article/NutUItaro34.jpg',
  'https://storage.360buyimg.com/jdc-article/NutUItaro2.jpg',
  'https://storage.360buyimg.com/jdc-article/welcomenutui.jpg',
  'https://storage.360buyimg.com/jdc-article/fristfabu.jpg'
])
</script>
